// 封装ajax函数
// 兼容GET和POST请求
function ajaxFn({ baseUrl, url, method, data = {}, headers = {}, callBack }) {
    // baseUrl 基础路径 (http://127.0.0.1:3000)
    // url 接口地址 (/api/xxx)
    // method 请求方式 (GET, POST, PUT)
    // data 请求参数 (get和post统一使用json格式)
    // headers 请求头
    // callBack 回调函数 (接收数据)
  
    let xhr = new XMLHttpRequest();
  
    // 判断是否为GET请求, 参数是需要拼接在url上
    let query = '?';
    if (Object.keys(data).length) {
      for (const key in data) {
        query += `${key}=${data[key]}&`;
      }
    }
  
    function setHeaders() {
      // 设置请求头
      if (Object.keys(headers).length) {
        for (const key in headers) {
          const element = headers[key];
          xhr.setRequestHeader(key, element);
        }
      }
    }
  
    if (method.toUpperCase() === 'GET') {
      // baseUrl + url + ?type=0&id=111
      xhr.open(method, baseUrl + url + query.slice(0, -1));
      setHeaders();
      xhr.send();
    } else {
      xhr.open(method, baseUrl + url);
      // 请求体要求发送一个json字符串
      setHeaders();
      xhr.send(JSON.stringify(data));
    }
  
    // 监听xhr对象请求的状态
    xhr.addEventListener('readystatechange', () => {
      if (xhr.readyState === 4) {
        if (xhr.status === 200) {
          callBack(JSON.parse(xhr.response));
        } else {
          // 可能出现了报错, 一般后端都会响应报错信息, 也需要返回出去到回调函数
          callBack(JSON.parse(xhr.response));
        }
      }
    });
  }
  
  export default ajaxFn;